import React, { useEffect, useState } from "react";
import LineStyle from "./line.module.css";
import ReactEcharts from "echarts-for-react";
import { Select } from "antd";
import LineOneComponent from "./Line1";
import LineTwoComponent from "./Line2";
import LineThreeComponent from "./Line3";
function LineComponent() {
  const [SelectVal,setSelectVal]=useState('2023')
const onSelectChange=(value)=>{
  setSelectVal(value)
}
  return (
    <div className={LineStyle.Line_app}>
      <Select
        style={{ width: "30%", margin: "10px 0" }}
        options={[
          {
            key: "1",
            value: "2023",
            label: "2023",
          },
          {
            key: "2",
            value: "2024",
            label: "2024",
          },
        ]}
        onChange={onSelectChange}
      />
      <div className={LineStyle.Line_app_item}>
        <LineOneComponent year={SelectVal} />
      </div>
      <div className={LineStyle.Line_app_item}>
        <LineTwoComponent />
      </div>
      <div className={LineStyle.Line_app_item}>
        <LineThreeComponent />
      </div>
    </div>
  );
}

export default LineComponent;
